<template>
	<view>
		<view class="details_image">
			<u-swiper :list='image_list' height="500" mode="number" interval="3500" border-radius="0"
				indicator-pos="topRight" @click="imgPreview()"></u-swiper>
		</view>
		<view class="details_title">
			<!-- 价格 -->
			<view class="details_title_price">
				￥{{goods_list.goodsPrice}}
				<span class="details_title_text" style="margin-left: 10rpx;">{{goods_list.goodsVarieties}}</span>
			</view>
			<u-icon :name="collect?'heart-fill':'heart'" size="54" @click="addcollect()" class="details_title_icon"
				:style="{'color':(collect?'rgba(255, 87, 51, 1)':'rgba(112, 112, 112, 1)')}"></u-icon>
		</view>
		<view class="datails_body">
			<view
				style="height: 100rpx;font-size: 30rpx;color: rgba(255, 87, 51, 1);line-height: 80rpx; border-bottom:1px solid rgba(166, 166, 166, 1);">
				商品详情
			</view>
			<view class="datails_body_text">
				<view class="datails_body_text_title">种类：</view>
				<view class="whitespace">{{goods_list.goodsType}}</view>
			</view>
			<view class="datails_body_text">
				<view class="datails_body_text_title">生产地区：</view>
				<view class="whitespace">{{goods_list.goodsProductionArea}}</view>
			</view>
			<view class="datails_body_text">
				<view class="datails_body_text_title">重量：</view>
				<view class="whitespace">{{goods_list.goodsKilogram}}</view>
			</view>
			<view class="datails_body_text">
				<view class="datails_body_text_title">单价：</view>
				<view class="whitespace">{{goods_list.goodsPrice}}</view>
			</view>
			<view class="datails_body_text">
				<view class="datails_body_text_title">预售：</view>
				<view class="whitespace">{{goods_list.goodsStatus==1?'是':'否'}}</view>
			</view>
			<view class="datails_body_text" v-if="goods_list.ispresale==1">
				<view class="datails_body_text_title">上新时间：</view>
				<view class="whitespace">{{goods_list.goodsNewTime}}</view>
			</view>
			<view class="datails_body_text">
				<view class="datails_body_text_title">上货日期：</view>
				<view class="whitespace">{{goods_list.goodsCreateTime}}</view>
			</view>
			<view class="datails_body_text">
				<view class="datails_body_text_title">备注：</view>
				<view class="whitespace">{{goods_list.remark}}</view>
			</view>
		</view>
		<view class="dateils_foot">
			<view class="dateils_foot_left">
				<!-- 联系商家，拨打电话 -->
				<u-icon name="phone" size="48" label="联系商家" label-pos="bottom" label-size="20"
					color="rgba(255, 141, 26, 1)" label-color="rgba(255, 141, 26, 1)" style="margin-left: 36rpx;"
					@click="callphone(goods_list.goodsContactNumber)"></u-icon>

			</view>
			<view class="dateils_foot_right">
				<button class="add_order" @click="placeorder()">下单</button>
				<!-- <button class="buy_now">立即购买</button> -->
			</view>
		</view>
		<view class="adaptation"></view>

	</view>
</template>

<script>
	// 商品详情页
	export default {
		data() {
			return {
				good_uuid: '', //接收uuid
				collect: 0,
				goods_list: {},
				image_list: []
				// imagesrc: 'https://bjetxgzv.cdn.bspapp.com/VKCEYUGU-uni-app-doc/44f8d690-4f3d-11eb-b680-7980c8a877b8.svg'
			}
		},
		methods: {
			async addcollect() {
				// if(this.collect) return 0;
				let url = this.collect?'/store/cancelStore':'/store/addStore';
				let data = this.collect?{
					thingUUId:this.good_uuid
				}:{
					thingType:this.goods_list.goodsStatus,
					thingUUId:this.good_uuid
				}
				await this.$myRequest({
					url: url,
					method: 'POST',
					data: data
				}).then(res=>{
					if(res.data.code===200){
						this.collect = !this.collect;
					}
					else{
						return 0;
					}
				})
			},
			placeorder() {
				let url = '../place_order/place_order?uuid=' + this.good_uuid + '&name=' + this.goods_list.goodsVarieties +
					'&price=' + this.goods_list.goodsPrice +
					'&adress=' + this.goods_list.goodsProductionArea + '&great_time=' + this.goods_list.goodsCreateTime +
					'&imagesrc=' + this.goods_list.goodsMainImgUrl;
				uni.navigateTo({
					url: url
				})
			},
			//图片预览 ----- 
			imgPreview(index) {
				uni.previewImage({
					current: 0,
					urls: this.image_list
				})
			},
			callphone(phone) {
				// console.log(12312312312312)
				uni.makePhoneCall({
					phoneNumber: phone //仅为示例
				});
			},
			async getproductinfo(id) {
				await this.$myRequest({
					url: '/goods/getGoodsDetails',
					method: 'POST',
					data: {
						// 'goodsStatus':0
						'goodsUUId': id
					}
				}).then((res) => {
					// console.log(res)
					if (res.data.code == 200) {
						// console.log(res.data);
						const gooddata = res.data.data;
						// console.log(gooddata)
						this.goods_list = gooddata.data[0];
						this.collect = gooddata.colStatus;
						let imagelist = gooddata.imgs.map(item=>{
							return {
								'image':item.imgUrl,
								'title':item.uuid
							}
						})
						this.image_list = imagelist;
						// console.log(this.image_list)
					}
					else{
						uni.showModal({
							title: '提示',
							content: '数据获取失败,请返回首页',
							showCancel: false,
							success: function(){
								uni.navigateBack()
							}
						})
						
					}
				})

			}

		},
		onLoad(option) {
			this.good_uuid = option.uuid;
			// this.good_uuid = option.uuid;
			this.getproductinfo(this.good_uuid);
		}
	}
</script>

<style>
	@import url("product_details.css");
</style>
